function Arrow () {
  this.x = 0
  this.y = 0
  // this.width = 0
  // this.
  this.color = '#2289FF'
  this.lineColor = "#2289FF"
  this.rotation = -Math.PI/2
}

Arrow.prototype.draw = function (context) {
  context.imageSmoothingQuality = 'high'
  context.globalCompositeOperation = 'destination-over'
  context.save()
  context.translate(this.x, this.y)
  context.rotate(this.rotation)
  context.lineWidth = 2
  context.fillStyle = this.color
  context.strokeStyle = this.lineColor
  context.beginPath()
  context.moveTo(20,-2) // 左边底角（开始）
  context.lineTo(50,-8) // 左边内角
  context.lineTo(45,-20) // 左边尖角
  context.lineTo(80,0) // 箭头顶点
  context.lineTo(45,20) // 右边尖角
  context.lineTo(50,8) // 右边内角
  context.lineTo(20,2) // 右边底角
  context.lineTo(20,-2) // 左边底角（结束）
  context.closePath()
  context.fill()
  context.stroke()
  context.restore()
}
